<template>
  <div>
    <div v-if="['picture-img','picture-card'].includes(column.listType)" class="avue-crud__img">
      <img v-for="(item,index) in getImgList(row,column)"
           :src="item"
           :key="index"
           @click="openImg(getImgList(row,column),index)"/>
    </div>
    <div v-else>
      <p v-for="(item,index) in getFileNameList(row,column)" :key="'name_key'+index" @click="downFile(row,column)">{{ item }}</p>
    </div>
  </div>
</template>

<script>
import {DIC_PROPS, DIC_HTTP_PROPS, DIC_SPLIT} from '../variable';

export default {
  formComponents: "upload",
  name: "ElColumnUpload",
  props: {
    column: {
      type: Object,
      default: () => {
        return {}
      }
    },
    row: [Object]
  },
  created() {
  },
  methods: {
    getImgList(row, column) {
      let url = (column.propsHttp || {}).home || '';
      let value = (column.props || {}).value || DIC_PROPS.value;
      if (this.validatenull(row[column.prop])) return [];
      if (column.listType === 'picture-img') return [url + row[column.prop]];
      let list = this.corArray(this.deepClone(row[column.prop]), column.separator);
      list.forEach((ele, index) => {
        if (typeof ele === 'object') {
          list[index] = url + ele[value];
        } else {
          list[index] = url + ele;
        }
      });
      return list;
    },
    openImg(list, index) {
      list = list.map(ele => {
        return {thumbUrl: ele, url: ele};
      });
      this.$ImagePreview(list, index);
    },
    getFileNameList(row, column) {

      let label = (column.props || {}).label || DIC_PROPS.label;
      if (this.validatenull(row[column.prop])) return [];
      let list = this.corArray(this.deepClone(row[column.prop]), column.separator);
      list.forEach((ele, index) => {
        if (typeof ele === 'object') {
          list[index] = ele[label];
        } else {
          list[index] = ele;
        }
      });

      return list;
    },
    corArray(list, separator = DIC_SPLIT) {
      if (this.validatenull(list)) {
        return [];
      } else if (!Array.isArray(list)) {
        return list.split(separator);
      }
      return list;
    },
    downFile(row, column, index) {
      let value = (column.props || {}).value || DIC_PROPS.value;
      if (this.validatenull(row[column.prop])) return;
      let item = row[index];
      if (!item[value]) return;
      window.open(item[value], '_blank');
    }
  }
}
</script>

<style scoped>

</style>
